﻿<%@ Page Title="" Language="C#" MasterPageFile="~/Masters/WithoutPermBasic.Master" AutoEventWireup="true" CodeBehind="SaleAnalyse.aspx.cs" Inherits="PMS.UI.DS.SaleAnalyse" %>

<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">
    <script src="../../Scripts/HighCharts/highcharts.js"></script>
    <script src="../../Scripts/HighCharts/modules/exporting.js"></script>
    <script src="../../Scripts/HighCharts/modules/drilldown.js"></script>
    <script src="https://img.hcharts.cn/highcharts-plugins/highcharts-zh_CN.js"></script>

    <script type="text/javascript">
        $(function () {
            var height = $("#divTotal").height();
            $("#report").css("height", parseInt(height * 0.8));
        })

    </script>

</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceToorbar" runat="server">
    <div id="master" class="container_18" style="height: auto; margin:20px 20px">
        <div class="grid_2 sealbl" style="text-align: right;">
            月度选择:
        </div>
        <div class="grid_2 seaval" style="text-align: left;">
            <input type="text" id="yearChose" />
        </div>
    </div>
</asp:Content>
<asp:Content ID="Content3" ContentPlaceHolderID="ContentPlaceHolder2" runat="server">
        <div id="report" style="min-width: 310px; height: auto; margin: 20px 20px"></div>

    <script type="text/javascript">
        monthData = [];
        seriesData = [];
        //绑定年度数据
        $("#yearChose").combobox({
            url: '/Logic/DS/DataAnalysAjax.aspx?method=GetProdYears',
            valueField: 'value',
            textField: 'text',
            panelHeight: 'auto',
            onSelect: function (record) {
                com.ajax({
                    url: '/Logic/DS/DataAnalysAjax.aspx?method=GetProdData',
                    data: { "yearMonth": record.value },
                    success: function (data) {
                        monthData = data.monthData;
                        seriesData = DataHandler(data.seriesData);
                        loadchart()
                    }
                })
            },
            onLoadSuccess: function () {
                loadchart()
            }
        });

        function DataHandler(originData) {
            dataOut = new Array();
            for (var i = 0; i < originData.length; i++) {
                var temp = new Object();
                temp.name = originData[i].name + "日";
                temp.id = originData[i].id;
                tempTemp = new Array();
                for (j = 0; j < originData[i].data.length; j++) {
                    tempTemp[j] = new Array(originData[i].data[j].cName, Number(originData[i].data[j].deliveryNum));
                }
                temp.data = tempTemp;
                dataOut[i] = temp
            }
            return dataOut
        };

        function loadchart() {
            Highcharts.chart('report', {
                chart: {
                    type: 'column'
                },
                title: {
                    text: $("#yearChose").combobox('getValues') == "" ? "请选择月度进行查看" : $("#yearChose").combobox('getValues') + " 每天分析数量"
                },
                xAxis: {
                    type: 'category'
                },
                yAxis: {
                    title: {
                        text: '气瓶数'
                    }
                },
                legend: {
                    enabled: false
                },
                plotOptions: {
                    series: {
                        borderWidth: 0,
                        dataLabels: {
                            enabled: true,
                        }
                    }
                },
                tooltip: {
                    headerFormat: '<span style="font-size:12px">{series.name}</span><br>',
                    pointFormat: '<span style="color:{point.color}">{point.name}</span>: <b>{point.y}</b><br/>'
                },
                series: [{
                    name: '日汇总',
                    colorByPoint: true,
                    data: monthData
                }],
                drilldown: {
                    series: seriesData
                }
            });
        }
    </script>
</asp:Content>
